.metro-roxo { background:#5234AC;}
.metro-verde {background:#008B17;}
.metro-azul { background:#2573EB;}
.metro-vermelho {background:#B21A41;}
.metro-laranja { background:#D64D29;}
.metro-info {background:#8B8989;}
.metro-logoutcolor{
	float:left;
	background:#8B8989;
	color: #fff;

}

.metro {
	position:relative;
    height:128px;
    margin-right:10px;
    margin-top:10px;
    cursor:pointer;
    pading: 5px;
    float:left;
    font-family: "Segoe UI Light","Segoe UI",Verdana, Tahoma, Arial;
}

.metrologout {
 cursor:pointer;
}
.metrologout:hover {
filter: alpha(opacity=80);
opacity: 0.8;
transform: rotate(180deg);
box-shadow: 1px 1px 10px #E74960, -1px -1px 10px #E74960;
-moz-box-shadow: 1px 1px 10px #E74960, -1px -1px 10px #E74960;
-webkit-box-shadow: 1px 1px 10px #E74960, -1px -1px 10px #E74960;
-khtml-box-shadow: 1px 1px 10px #E74960, -1px -1px 10px #E74960;
}

.metro:hover {
filter: alpha(opacity=80);
opacity: 0.8;
transform: rotate(180deg);
box-shadow: 5px 4px 10px #333, -5px -5px 10px #ccc;
-moz-box-shadow: 5px 4px 10px #333, -5px -5px 10px #ccc;
-webkit-box-shadow: 5px 4px 10px #333, -5px -5px 10px #ccc;
-khtml-box-shadow: 5px 4px 10px #333, -5px -5px 10px #ccc;
}

.metro-panel {
    width:30%;
    padding:5px;
    height:70px;
    display:table;  
    positon:relative;
	margin-left: auto;
	margin-right: auto;
	
	
}

.metro-panel-logout {
    width:30px;
    height:30px;      
    positon:relative;
	float:right;	
	marging-top: 100px; 

}

.metro .imgsimple {
    height:64px;
    width:64px;
    padding:20px 53px 10px 53px;
    border:0px;
    text-align:center;
    float:left;
    position:relative;
}

.metro .imgdouble {
    float:left;
    width:100%;
    padding:20px 0px 10px 0px;
    text-align:center;
}

.metro .imgdoublelogout {
    float:left;
    width:100%;
    
    padding:20px 0px 10px 0px;
    text-align:center;
}


.metro .imglabeled {
    float:left;
    padding:30px 0px 0px 10px;
    text-align:left;
}

.metro span {
    position:relative;
    height:20px;
    text-decoration:none;
    color:rgba(255, 255, 255, 1.0);
    float:left;
    text-align:center;
    clear:both;
    width:100%;
    bottom:0px;
}

.metro .metrolabel {
    text-decoration:none;
    color:rgba(255, 255, 255, 1.0);
    float:left;
    text-align:center;
    font-size:28px;
    margin-top:40px;
}

.metro span:hover {
}

.metrosingle {
    width:170px;
}
.metrosinglelogout {
	text-align:center;
    
}

.metrodouble {
    width:350px;
}

.metro-destaque-rodape {
	position:absolute;
	bottom:0px;
	left:0px;
	width:100%;
	height:26px;
	padding-top:4px;
}